<template>
    <div class="common siteDetail">
        <innerCommon 
            :location="location"
        >
            <template slot="left">
                <span>站点预览</span>
            </template>
            <div slot="right">
                <a-button type="primary" @click="returnBack()">返回</a-button>
            </div>
            <div slot="table" class="tableWrap">
                <ul v-if="info">
                    <li>
                        <span>单位名称：</span>
                        <span>{{info.name}}</span>
                    </li>
                    <li>
                        <span>单位属性：</span>
                        <span>{{info.role}}</span>
                    </li>
                    <li>
                        <span>单位logo：</span>
                        <img :src="info.logo" alt="" v-if="info.logo"  class="preLogo">
                        <span v-else>暂无</span>
                    </li>
                    <li>
                        <span>申请内容：</span>
                        <span class="courseInfo">{{info.content||'暂无'}}</span>
                        <!-- <span v-if="info.content" v-html="info.content"></span> -->
                    </li>
                    <li>
                        <span>申请材料：</span>
                        <span v-if="info.document">
                            <a style="display:block" v-for="(item,index) in info.document" :key="index" :href="item.path">
                                <a-icon type="file" />{{item.filename}}
                            </a>
                        </span>
                        <span v-else>暂无</span>
                    </li>
                </ul>
            </div>
        </innerCommon>
        
    </div>
</template>
<script>
import {getSiteDetailApi} from "@/request/api"
import innerCommon from "@/components/common/innerCommon"
export default {
    name:'courseDetail',
    components:{innerCommon},
    created(){
        this.location=[{
            name:"1+X管理",
            path:''
        },{
            name:"站点管理",
            path:'/siteManage'
        },{
            name:"站点详情",
            path:''
        }]
        this.siteId=this.$route.query.id
        this.init()
    },
    data(){
        return{
            location:[],
            siteId:'',
            info:null,
        }
    },
    methods:{
        init(){
            this.getToken(getSiteDetailApi,{'siteId':this.siteId},res=>{
                this.info={...res.data,...res.data.institute}
            })
        },
        returnBack(){
            this.$router.push({path:"/siteManage",query:this.$route.query})
        },
    }
}
</script>
<style lang="stylus" scoped>
.siteDetail
    ul
        list-style:none;
        position:relative
        li
            line-height:40px;
            align-items: flex-start;
            display:flex;
            span    
                &:nth-child(1)
                    width:90px;
                    display:inline-block;
                    font-weight:bold;
                &:nth-child(2)
                    display:inline-block;
                    width:80%;
            span.courseInfo
                border:1px solid #ddd;
                padding:10px;
                height:500px;
                overflow-y:scroll;
            img.preLogo
                height:120px;
                margin-bottom:10px;
        li.cover
            position:absolute;
            top:0;
            right:15%;
            img 
                height:150px;
</style>